<template>
  <div class="lt_notice">
    <!--*********************-->
    <div>
      <!--公告公开-->
      <div v-for="item in lists" class="notice" @click="toListDetail(item.id)">
        <p class="detail_title">{{item.title}}</p>
        <div style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap" class="desc">{{item.desc}}</div>
        <p class="date">{{item.create_at}}</p>
      </div>
      <!--公告公开-->
    </div>
    <!--*********************-->
  </div>
</template>

<script>
  export default {
    name: "mdList",
    data() {
      return {
        // gov_id: 27,
        gov_id: '',
        lists: []
      }
    },

    created() {
      this.gov_id = this.$route.query.gov_id;
      console.log('gov_id', this.gov_id);
      // console.log('gid', this.gid);
      this.getList();
    },

    watch: {
      //监听相同路由下参数变化的时候，从而实现异步刷新
      '$route'(to, from) {
        this.gov_id = this.$route.query.gov_id;
        // this.gov_id = 27;
        this.getList();
      },
    },

    methods: {
      getList() {
        let that = this;
        that.$http.get('/api/WxProgramApi/getGovernDetail?page=1&limit=1000', {
          gov_id: that.gov_id,
          vollege_id: that.$util.vollege_id
        }, r => {
          console.log('列表：', r)
          that.lists = r.data.data;
        })
      },

      toListDetail(id) {
        console.log('您点击了跳转路由事件！,公告公示id：', id);
        this.$router.push({path: '/detail', query: {id: id,name:'治理现代化'}});
      },

    }

  }
</script>

<style scoped>
  .lt_notice {
    /*padding: 56px 50px 0 50px;*/
    padding-top: 60px;
    padding-left: 70px;
    width: 1300px;
  }

  .notice {
    position: relative;
    width: 100%;
    height: 200px;
    border-bottom: 2px solid #cccccc;
    padding: 25px 10px;
  }
</style>
